<template>
<div>
    <el-header style="text-align: right; font-size: 12px;background-color:#545c64"> 
        <el-col :span="18">
            <el-menu
            :default-active="this.$route.path"
            router
            class="el-menu-demo"
            mode="horizontal"
            @select="handleSelect"
            background-color="#545c64"
            text-color="#fff"
            active-text-color="#ffd04b">
                <el-menu-item v-for="(item,index) in navList" :index="item.path" :key="index">
                    {{item.name}}
                </el-menu-item>
            </el-menu>
        </el-col>
        <el-col :span="6">
            <!-- <el-dropdown trigger="click">
                <span class="el-dropdown-link">
                    下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
                </span>
                <el-dropdown-menu slot="dropdown" >
                    <el-dropdown-item icon="el-icon-user">个人中心</el-dropdown-item>
                    <el-dropdown-item icon="el-icon-setting">修改</el-dropdown-item>
                    <el-dropdown-item icon="el-icon-close">注销</el-dropdown-item>
                </el-dropdown-menu>
            </el-dropdown> -->
        </el-col>
    </el-header>
</div>
</template>

<script>
  export default {
      data() {
          return {
              activeIndex2: '1',
        navList:[
            {path:'/',name:'首页'},
            {path:'/blog',name:'博客'},
            {path:'/video',name:'视频'},
        ]
      };
    },
    methods: {
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      }
    }
  }
</script>
<style>
    .el-dropdown-link {
        cursor: pointer;
        color: #409EFF;
    }
    .el-icon-arrow-down {
        font-size: 12px;
    }
    .demonstration {
        display: block;
        color: #8492a6;
        font-size: 14px;
        margin-bottom: 20px;
    }
    .clearfix:before,
    .clearfix:after {
        display: table;
        content: "";
    }
    .clearfix:after {
        clear: both
    }
</style>